// webpack 是 node 写出来的, node的写法
let path = require('path')
let HtmlWebpackPlugin = require('html-webpack-plugin')
const { CleanWebpackPlugin } = require('clean-webpack-plugin')
const CopyWebpackPlugin = require('copy-webpack-plugin')
let Webpack = require('webpack')

// 1. cleanWebpackPlugin
// 2. copyWebpackPlugin
// 3. bannerPlugin  内置的  版权声明插件
module.exports = {
    resolve: { // 解析 第三方包 common 
        modules: [
            path.resolve('node_modules'),
        ],
        extensions: ['.js', '.css', '.json', '.vue']
        // mainFields: ['style', 'main']
        // mainFields: [] // 入口文件的名字 index.js
        // alias: {
        //     'bootstrap': 'bootstrap/dist/css/bootstrap.css'
        // }
    },
    devServer: {
        // 开发服务器的配置
        port: 5000,
        progress: true,
        contentBase: './build',
        compress: true,
        open: true,
        // 3. 有服务端 不想用代理来处理 能不能在服务端中启动 webpack, 服务端端口用 webpack
        // 2. 前端只想单纯来模拟数据
        // before(app) { // 提供的方法
        //     app.get('/user', (req, res) => {
        //         res.json({
        //             name: 'shubuzuo'
        //         })
        //     })
        // },
        // 1. 代理
        // proxy: { // 重写的方式 把请求代理到 express 服务器 上
        //     '/api': {
        //         target: 'http://localhost:3000',
        //         pathRewrite: {
        //             '/api': ''
        //         }
        //     }, // 配置了 一个代理 
        // },
    },
    // mode: 'development', // 默认两种 production development
    mode: 'production',
    entry: {
        home: './src/index.js',
    }, //  入口
    output: {
        filename: '[name].js', // 打包后的文件名
        path: path.resolve(__dirname, 'dist'), // 路径必须是一个绝对路径 
        // publicPath: 'http://www.zhufengpeixun.cn',
    },
    plugins: [
        new HtmlWebpackPlugin({
            template: './src/index.html',
            filename: 'index.html',
        }),
        // new CleanWebpackPlugin(),
        // new CopyWebpackPlugin({ // 拷贝插件
        //     patterns: [{
        //         from: './dist',
        //         to: path.resolve(__dirname + '/build')
        //     }]
        // }),
        // new Webpack.BannerPlugin('shubuzuo')
    ],
    externals: {
    },
    module: { // 模块
        rules: [ // loader 默认是 从右到左 从下到上执行
            {
                test: /\.css$/,
                use: ['style-loader', 'css-loader']
            },
            {
                test: /\.js$/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ['@babel/preset-env']
                    }
                },
            }
        ]
    }
}